<!DOCTYPE html>
<!-- saved from url=(0050)http://www.swiper.com.cn//demo/festival/index.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>艾瑞克斯科技产业园·25万㎡智能科技产业大城</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!--<link rel="stylesheet" href="/dist/css/swiper.min.css">
<link rel="stylesheet" href="/dist/css/animate.min.css">
<script src="/dist/js/swiper.min.js"></script>
<script src="/dist/js/swiper.animate.min.js"></script>-->

<link rel="stylesheet" href="./css/swiper.min.css">
<link rel="stylesheet" href="./css/animate.min.css">
<script src="./js/swiper.min.js.下载"></script>
<script src="./js/swiper.animate.min.js.下载"></script>

<style>

.uiwm-footpanel{width:100%;position:fixed;box-shadow:0 0 4px #aaa;bottom:0;border-top:1px solid #ccc;border-bottom:1px solid #ccc;height:48px;background-color:#fff;z-index: 2;}.
.uiwm-footpanel .uiwm-rev{width:100%;position:relative}
.uiwm-footpanel .uiwm-rev .uiwm-mp-img{width:64px;height:64px;left:10px;top:-30px;padding:2px;background:#fff;box-shadow:0 0 4px #aaa;border-radius:50%;border:1px solid #d6d6d6;position:absolute}
.uiwm-footpanel .uiwm-rev .uiwm-mp-img img{width:64px;height:64px;border-radius:50%;position:absolute;z-index:1}
.uiwm-footpanel .uiwm-rev .uiwm-mp-img::after{content:" ";display:block;position:absolute;background-color:#fff;width:76px;height:44px;left:-3px;top:29px}
.uiwm-footpanel .uiwm-rev h4{font-size:15px;padding-left:88px;padding-top:2px}
.uiwm-footpanel .uiwm-rev h4 small{font-size:11px;color:#666;padding-left:3px}
.uiwm-footpanel .uiwm-rev .uiwm-mp-phone{display:block;color:#168adc;font-size:15px;padding-left:88px}
.uiwm-phone-a,.uiwm-message-a{width:48px;height:48px;position:absolute;top:-1px;text-align:center;line-height:48px;border:1px solid #ccc}
.uiwm-phone-a{right:49px}
.uiwm-message-a{right:0}
.uiwm-bmfoot-panel{padding-top:6px;padding-bottom:6px;width:100%;position:fixed;bottom:0;border-top:1px solid #ccc;background-color:#fff;box-shadow:0 0 4px #aaa}
.uiwm-bmfoot-panel #uiwm_bmflex{-webkit-box-pack:center}
.uiwm-bmfoot-panel #uiwm_ggy{color:#168adc}.uiwm-bmfoot-panel #uiwm_signupnow{border-radius:3px;color:#fff}
@media screen and (min-width:321px)
{.uiwm-footpanel{box-shadow:0 0 4px #aaa;height:55px}
.uiwm-footpanel .uiwm-rev .uiwm-mp-img{width:70px;height:70px;left:10px;top:-30px;padding:2px;box-shadow:0 0 4px #aaa}
.uiwm-footpanel .uiwm-rev .uiwm-mp-img img{width:70px;height:70px;border-radius:50%;position:absolute;z-index:1}
.uiwm-footpanel .uiwm-rev .uiwm-mp-img::after{content:" ";width:85px;height:50px;left:-7px;top:29px}
.uiwm-footpanel .uiwm-rev h4{font-size:17px;padding-left:95px;padding-top:2px}
.uiwm-footpanel .uiwm-rev h4 small{font-size:12px;padding-left:5px}
.uiwm-footpanel .uiwm-rev .uiwm-mp-phone{font-size:17px;padding-left:95px}
.uiwm-phone-a,.uiwm-message-a{width:57px;height:57px;line-height:57px}
.uiwm-phone-a{right:58px}
.uiwm-message-a{right:0}
.uiwm-bmfoot-panel{padding-top:9px;padding-bottom:9px}}
a{text-decoration:none;}
*{
  margin:0;
  padding:0;
}
html,body{
  height:100%;
}
body{
  font-family:"microsoft yahei";
  background-color: #fff;
}
.swiper-container {
  /*  width: 320px;
    height: 480px;*/
  width: 100%;
    height: 100%;
  background:#fff;
}  
.swiper-slide{
}
.swiper-slide{
  width:100%;
  height:100%;
  background:url(images/bg.jpg) no-repeat ;
  background-size:100% 105%;
}
img{
  display:block;
}
.swiper-pagination-bullet {
width: 6px;
height: 6px;
background: #fff;
opacity: .4;
}

</style>
</head>

<body>

   <div class="">  
        <div><img src="images/c1.jpg" style="width:100%;"></div>
        <div><img src="images/c2.jpg" style="width:100%;"></div>        
        <div><img src="images/c3.jpg" style="width:100%;"></div>
        <div><img src="images/c4.jpg" style="width:100%;"></div>
        <div><img src="images/c5.jpg" style="width:100%;"></div>
        <div><img src="images/c6.jpg" style="width:100%;"></div>        
        <div><img src="images/c7.jpg" style="width:100%;"></div>
        <div><img src="images/c8.jpg" style="width:100%;"></div>
        <div><img src="images/c9.jpg" style="width:100%;"></div>
        <div><img src="images/c10.jpg" style="width:100%;"></div>  
        <div><img src="images/c11.jpg" style="width:100%;"></div>
        <div><img src="images/c12.jpg" style="width:100%;"></div>
        <div><img src="images/c13.jpg" style="width:100%;"></div>
        <div><img src="images/c14.jpg" style="width:100%;"></div> 
                <div><img src="images/c15.jpg" style="width:100%;"></div>  
        <div><img src="images/c16.jpg" style="width:100%;"></div>
        <div><img src="images/c17.jpg" style="width:100%;"></div>
        <div><img src="images/c18.jpg" style="width:100%;"></div>
        <div><img src="images/c19.jpg" style="width:100%;"></div> 

    </div>





        <div class="uiwm-footpanel" id="cardDiv">
                <div class="uiwm-rev">
                    <div class="uiwm-mp-img">
                        <img id="cardImg" src="./images/3607.png">
                    </div>
                    <h4 id="cardName" style="font-size:19px;margin-top: 0.5em;margin-left:1em;">杨小姐&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <a href="tel:13622759862" id="cardPha" class="uiwm-mp-phone" style="margin-left:0.5em;font-size:18px;color:#001d53;font-weight: bold;margin-top: -1.3em">136-2275-9862</a>
                      </a>

                    </h4>


                </div>
        </div>



<script>  

//所有.resize元素 根据当前窗口的大小进行宽高调整：
//当前页面的所有元素以窗口宽度320，高度480为基准进行高宽设计的。所以适应其他窗口时进行比例调整(比例为：window.innerWidth/320,window.innerHeight/480)。
scaleW=window.innerWidth/320;
scaleH=window.innerHeight/480;
var resizes = document.querySelectorAll('.resize');
          for (var j=0; j<resizes.length; j++) {
           resizes[j].style.width=parseInt(resizes[j].style.width)*scaleW+'px';
       resizes[j].style.height=parseInt(resizes[j].style.height)*scaleH+'px';
       resizes[j].style.top=parseInt(resizes[j].style.top)*scaleH+'px';
       resizes[j].style.left=parseInt(resizes[j].style.left)*scaleW+'px'; 
  
          }

//字体元素也根据比例调整
var scales = document.querySelectorAll('.txt');
for (var i=0; i<scales.length; i++) {
  ss=scales[i].style;
  ss.webkitTransform = ss.MsTransform = ss.msTransform = ss.MozTransform = ss.OTransform =ss.transform='translateX('+scales[i].offsetWidth*(scaleW-1)/2+'px) translateY('+scales[i].offsetHeight*(scaleH-1)/2+'px)scaleX('+scaleW+') scaleY('+scaleH+') ';
}

      
  var mySwiper = new Swiper ('.swiper-container', {
    direction : 'vertical',
    pagination: {
     el:'.swiper-pagination',
    },
    mousewheel: true,
    on:{
    init: function(){
        swiperAnimateCache(this);
        swiperAnimate(this);
    },
      slideChangeTransitionEnd: function(){
        swiperAnimate(this);
      }
    }
  })         
  </script>
</body>
</html>
